<template>
	<view class="detWrap">
		<view class="modCon">
			<view class="userInfo spaceBet">
				<image class="userHead" :src="defHead"></image>
				<view class="userTit">个人信息</view>
			</view>
			<view class="conItem">
				<view class="itemTit">姓名</view>
				<view class="itemCon">张珊珊</view>
			</view>
			<view class="conItem">
				<view class="itemTit">性别</view>
				<view class="itemCon">女</view>
			</view>
			<view class="conItem">
				<view class="itemTit">联系电话</view>
				<view class="itemCon">152363251218</view>
			</view>
			<view class="conItem">
				<view class="itemTit">紧急联系人</view>
				<view class="itemCon">张婷婷</view>
			</view>
			<view class="conItem">
				<view class="itemTit">紧急联系人电话</view>
				<view class="itemCon">13636252369</view>
			</view>
			<mod-tit modTit="咨询内容"></mod-tit>
			<view class="tagMod hasFlex">
				<view class="tagItem">亲子教育</view>
				<view class="tagItem">婚姻家庭</view>
				<view class="tagItem">职场发展</view>
			</view>
			<mod-tit modTit="预约时间"></mod-tit>
			<view class="content">2023-08-28 15:20~16:20</view>
			<mod-tit modTit="预约地址"></mod-tit>
			<view class="content">濮阳市综治管理中心三楼心理咨询室</view>
			<mod-tit modTit="咨询前问答"></mod-tit>
			<view class="queMod">
				<view class="queItem">
					<view>1、是否接受过心理咨询?</view>
					<view class="queAns">否</view>
				</view>
				<view class="queItem">
					<view>2、是否接受过精神科相关的诊断或治疗?</view>
					<view class="queAns">否</view>
				</view>
				<view class="queItem">
					<view>3、否有过自伤/自杀的想法或行为?</view>
					<view class="queAns">否</view>
				</view>
			</view>
		</view>
		<view class="modCon">
			<mod-tit modTit="订单信息" :hasBorBotFlag="true"></mod-tit>
			<view class="conItem">
				<view class="itemTit">下单时间</view>
				<view class="itemCon">2023-11-20 20:12:32</view>
			</view>
			<view class="conItem">
				<view class="itemTit">订单编号</view>
				<view class="itemCon">212251221145512</view>
			</view>
			<view class="conItem">
				<view class="itemTit">订单状态</view>
				<view class="itemCon wait">待咨询</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import ModTit from '@/components/mod-tit/mod-tit.vue'
	export default {
		components:{
			ModTit
		},
		data(){
			return{
				fromPage:'',//zxRec gyRec 
				defHead:this.defHead
			}
		}
	}
</script>
        
<style lang="scss">
	page{
		background: $pss-bg-primary;
		border-top: $comBor;
	}
	.detWrap{
		padding: 20rpx 30rpx;
	}
	.modCon{
		background: #fff;
		padding: 20rpx;
		margin-bottom: 20rpx;
		&:last-child{
			margin-bottom: 0;
		}
		.userInfo{
			align-items: center;
			border-bottom: 1rpx solid #ccc;
			padding-bottom: 20rpx;
			margin-bottom: 20rpx;
			.userTit{
				font-size: 30rpx;
				font-weight: 600;
			}
			.userHead{
				width: var(--hei60);
				height: var(--hei60);
				border: 50%;
			}
		}
		.conItem,
		.queItem{
			display: flex;
			justify-content: space-between;
			height: var(--hei70);
			line-height: var(--hei70);
			font-size: 28rpx;
			color: $pss-text-color0;
			.itemTit{
				color: $pss-text-color8;
			}
			.queAns,
			.wait{
				color:$pss-color-primary;
			}
			.comp{
				color: $pss-color-blueDeep;
			}
			.cancel{
				color: #ccc;
			}
		}
		.tagMod{
			flex-wrap:wrap;
			.tagItem{
				height: 38rpx;
				line-height: 38rpx;
				border: 1rpx solid #00E0DB;
				color: #00E0DB;
				font-size: 24rpx;
				padding: 0 15rpx;
				border-radius: 6rpx;
				margin:0 15rpx 15rpx 0;
			}
		}
		.content{
			color: $pss-color-blueDeep;
			font-size: 28rpx;
		}
	}
</style>